import 'package:flutter/material.dart';
import 'package:flutter_app/values/MyColors.dart';
import 'package:flutter_app/widget/customer_progress.dart';
import 'package:flutter_screenutil/src/size_extension.dart';
import 'package:get/get.dart';

import '../../../r.dart';
import 'mine_logic.dart';

/**
 * @Description: 我的页面
 * @Author: 下雨了
 * @CreateDate: 2022-6-1 14:28:46
 * @Version: 1.0
 */
///
class MinePage extends StatefulWidget {
  final String title;

  const MinePage({
    Key? key,
    required this.title,
  }) : super(key: key);

  @override
  _MinePageState createState() => _MinePageState();
}

class _MinePageState extends State<MinePage> {
  final logic = Get.put(MineLogic());
  final state = Get.find<MineLogic>().state;

  @override
  Widget build(BuildContext context) {
    return GetBuilder<MineLogic>(builder: (logic) {
      return Scaffold(
        backgroundColor: MyColors.FFF1F1F1,
        body: SingleChildScrollView(
          child: Stack(
            children: [
              Image.asset(R.assetsImgBg112),
              Column(
                children: [
                  Container(
                    margin: EdgeInsets.only(left: 17.r, right: 17.r, top: 64.5.r),
                    height: 187.r,
                    child: Stack(
                      children: [
                        Container(
                          margin: EdgeInsets.only(top: 20.r),
                          height: 157.r,
                          width: Get.width,
                          decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(5.r),
                              color: Colors.white
                          ),
                          child: Column(
                            children: [
                              Expanded(
                                child: Column(
                                  children: [
                                    Container(
                                      margin: EdgeInsets.only(top: 22.r, left: 25.r),
                                      child: Row(
                                        children: [
                                          GestureDetector(
                                            child: Container(
                                              width: 55.r,
                                              height: 55.r,
                                              decoration: BoxDecoration(
                                                borderRadius: BorderRadius.circular(5.r)
                                              ),
                                              child: (state.userInfo?.headUrl?.isNotEmpty ?? false)
                                                  ? Image.network(state.userInfo!.headUrl!, fit: BoxFit.cover,)
                                                  : Image.asset(R.assetsImgIcon0),
                                            ),
                                            onTap: () {
                                              showModalBottomSheet(
                                                context: context,
                                                shape: RoundedRectangleBorder(
                                                    borderRadius: BorderRadius.only(
                                                        topLeft: Radius.circular(13.33.r),
                                                        topRight: Radius.circular(13.33.r))),
                                                // isScrollControlled属性，设置为true，弹窗会覆盖整个手机。设置为false，弹窗大概是整个屏幕的9/16高。
                                                isScrollControlled: true,
                                                builder: (BuildContext context) {
                                                  return SafeArea(
                                                    child: SingleChildScrollView(
                                                      child: Column(
                                                        children: [
                                                          SizedBox(
                                                            width: MediaQuery.of(context).size.width,
                                                            height: 50.r,
                                                            child: TextButton(
                                                              child: Text("拍照", style: TextStyle(color: MyColors.FF666666, fontSize: 14.sp),),
                                                              onPressed: () async {
                                                                Navigator.pop(context);
                                                                logic.openCameraUp();
                                                              },
                                                            ),
                                                          ),
                                                          Column(
                                                            children: [
                                                              Divider(height: 1, thickness: 1, color: MyColors.FFF5F5F5,),
                                                              SizedBox(
                                                                width: MediaQuery.of(context).size.width,
                                                                height: 50.r,
                                                                child: TextButton(
                                                                  child: Text("相册", style: TextStyle(color: MyColors.FF666666, fontSize: 14.sp),),
                                                                  onPressed: () async {
                                                                    Navigator.pop(context);
                                                                    logic.openPhotoUp();
                                                                  },
                                                                ),
                                                              ),
                                                            ],
                                                          ),
                                                          Divider(height: 1, thickness: 5, color: MyColors.FFF5F5F5,),
                                                          SizedBox(
                                                            width: MediaQuery.of(context).size.width,
                                                            height: 50.r,
                                                            child: TextButton(
                                                              child: Text("取消", style: TextStyle(color: MyColors.FFE5261E, fontSize: 14.sp),),
                                                              style: ButtonStyle(
                                                                padding: MaterialStateProperty.all(EdgeInsets.all(0)),
                                                              ),
                                                              onPressed: () {
                                                                Navigator.pop(context);
                                                              },
                                                            ),
                                                          ),
                                                        ],
                                                      ),
                                                    ),
                                                  );
                                                },
                                              );

                                            },
                                          ),
                                          SizedBox(width: 10.r,),
                                          Column(
                                            crossAxisAlignment: CrossAxisAlignment.start,
                                            children: [
                                              SizedBox(
                                                width: 85.r,
                                                child: Text(state.userInfo?.userName ?? "",
                                                  maxLines: 1,
                                                  style: TextStyle(color: MyColors.FF333333, fontSize: 17.sp, fontWeight: FontWeight.w600),
                                                ),
                                              ),
                                              // Text(state.userInfo?.occupation ?? "", maxLines: 1, style: TextStyle(color: MyColors.FF888888, fontSize: 12.sp),),
                                              Text("", maxLines: 1, style: TextStyle(color: MyColors.FF888888, fontSize: 12.sp),),
                                            ],
                                          )
                                        ],
                                      ),
                                    ),
                                    Container(
                                      margin: EdgeInsets.only(top: 15.r, left: 25.r),
                                      child: Row(
                                       children: [
                                         Text("任务参与率", style: TextStyle(color: MyColors.FF666666, fontSize: 14.sp)),
                                         SizedBox(width: 4.r,),
                                         Text(state.signRate.value, style: TextStyle(color: MyColors.FF333333, fontSize: 18.sp)),
                                       ],
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                              Align(
                                alignment: Alignment.bottomCenter,
                                child: Container(
                                  height: 33.r,
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.vertical(
                                      bottom: Radius.circular(5.r),
                                    ),
                                    gradient: LinearGradient(
                                      begin: Alignment.centerRight,
                                      end: Alignment.centerLeft,
                                      colors: [Colors.white, MyColors.FFF4E2C3],
                                    ),
                                  ),
                                  child: Row(
                                    children: [
                                      SizedBox(width: 20.r,),
                                      Text("切换年份", style: TextStyle(color: MyColors.FF666666, fontSize: 13.sp),),
                                      SizedBox(width: 4.r,),
                                      DropdownButton(
                                        items: [
                                          for (String item in logic.yearItems) DropdownMenuItem(
                                            child: Text(item + "年", style: TextStyle(color: MyColors.FFA28056, fontSize: 14.sp, fontWeight: FontWeight.w500),), value: item,)
                                        ],
                                        value: logic.year,
                                        hint: Row(
                                          children: [
                                            Text(logic.year, style: TextStyle(color: MyColors.FFA28056, fontSize: 14.sp, fontWeight: FontWeight.w500),),
                                            Text(" 年", style: TextStyle(color: MyColors.FFA28056, fontSize: 14.sp, fontWeight: FontWeight.w500),),
                                          ],
                                        ),
                                        icon: Icon(Icons.arrow_drop_down, color: MyColors.FFA28056,),
                                        iconSize: 20.sp,
                                        underline: Container(height: 0,),
                                        isDense: true,
                                        alignment: AlignmentDirectional.bottomCenter,
                                        onChanged: (value){
                                          setState(() {
                                            logic.year = value.toString();
                                            logic.refreshData(value.toString());
                                          });
                                        },
                                      ),
                                    ],
                                  ),
                                ),
                              )
                            ],
                          ),
                        ),
                        Align(
                          alignment: Alignment.topRight,
                          child: Container(
                            margin: EdgeInsets.only(right: 7.r),
                            width: 155.r,
                            height: 155.r,
                            child: CustomPaint(
                              child: Column(
                                children: [
                                  SizedBox(height: 48,),
                                  Text("任务积分", style: TextStyle(fontSize: 14.sp, color: MyColors.FF666666),),
                                  SizedBox(height: 2.r,),
                                  Text(state.score.value, style: TextStyle(fontSize: 30.sp, color: MyColors.FFC0453E, fontWeight: FontWeight.w600),),
                                  SizedBox(height: 12.r,),
                                  InkWell(
                                    child: Text("积分明细 >", style: TextStyle(fontSize: 12.sp, color: MyColors.FFA28056, fontWeight: FontWeight.w600),),
                                    onTap: () {
                                      logic.goToAccumulatePointsPage();
                                    },
                                  ),
                                ],
                              ),
                              painter: CustomerProgress(
                                //设置背景色
                                backgroundColor: MyColors.FFF1F1F1,
                                //设置前景色
                                startProgressColor: MyColors.FFFF8B63,
                                endProgressColor: MyColors.FFF03F35,
                                //Canvas绘制开始位置
                                startPointAngle: 135,
                                // 结束位置
                                endPointAngle: 270,
                                //半径
                                radius: 60.r,
                                //设置线条宽度（此处为背景线条宽度）
                                lineWidth: 20.0.r,
                                //是否闭合，闭合后即为扇形
                                centerClose: false,
                                value: state.progressValue.value,
                              ),
                            ),
                          ),
                        )
                      ],
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.fromLTRB(17.r, 20.r, 17.r, 0),
                    child: Material(
                      color: Colors.white,
                      borderRadius: BorderRadius.all(Radius.circular(5.r)),
                      child: InkWell(
                        borderRadius: BorderRadius.all(Radius.circular(5.r)),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Row(
                              children: [
                                Padding(
                                  padding: EdgeInsets.only(left: 18.r, top: 18.r, bottom: 18.r),
                                  child: Image.asset(R.assetsImgIcon65, height: 17.r,),
                                ),
                                Padding(
                                  padding: EdgeInsets.only(left: 8.r, top: 18.r, bottom: 18.r),
                                  child: Text('我的报名', style: TextStyle(color: MyColors.FF333333, fontSize: 15.sp),),
                                ),
                              ],
                            ),
                            Padding(
                              padding: EdgeInsets.only(right: 24.r, top: 20.r, bottom: 20.r),
                              child: Image.asset(R.assetsImgIcon48, width: 7.r,),
                            ),
                          ],
                        ),
                        onTap: (){
                          logic.goToMyApply();
                        },
                      ),
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.fromLTRB(17.r, 13.r, 17.r, 0),
                    child: Material(
                      color: Colors.white,
                      borderRadius: BorderRadius.all(Radius.circular(5)),
                      child: InkWell(
                        borderRadius: BorderRadius.all(Radius.circular(5)),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Row(
                              children: [
                                Padding(
                                  padding: EdgeInsets.only(left: 18.r, top: 18.r, bottom: 18.r),
                                  child: Image.asset(R.assetsImgIcon67, height: 17.r,),
                                ),
                                Padding(
                                  padding: EdgeInsets.only(left: 8.r, top: 18.r, bottom: 18.r),
                                  child: Text('随手拍上报记录', style: TextStyle(color: MyColors.FF333333, fontSize: 15.sp),),
                                ),
                              ],
                            ),
                            Padding(
                              padding: EdgeInsets.only(right: 24.r, top: 20.r, bottom: 20.r),
                              child: Image.asset(R.assetsImgIcon48, width: 7,),
                            ),
                          ],
                        ),
                        onTap: () {
                          logic.goToFilmPage();
                        },
                      ),
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.fromLTRB(17.r, 13.r, 17.r, 0),
                    child: Material (
                      color: Colors.white,
                      borderRadius: BorderRadius.all(Radius.circular(5.r)),
                      child: InkWell(
                        borderRadius: BorderRadius.all(Radius.circular(5.r)),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Row(
                              children: [
                                Padding(
                                  padding: EdgeInsets.only(left: 18.r, top: 18.r, bottom: 18.r),
                                  child: Image.asset(R.assetsImgIcon66, height: 17.r,),
                                ),
                                Padding(
                                  padding: EdgeInsets.only(left: 8.r, top: 18.r, bottom: 18.r),
                                  child: Text('设置', style: TextStyle(color: MyColors.FF333333, fontSize: 15.sp),),
                                ),
                              ],
                            ),
                            Padding(
                              padding: EdgeInsets.only(right: 24.r, top: 20.r, bottom: 20.r),
                              child: Image.asset(R.assetsImgIcon48, width: 7.r,),
                            ),
                          ],
                        ),
                        onTap: (){
                          logic.goToSetPage();
                        },
                      ),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      );
    });
  }

  @override
  void dispose() {
    Get.delete<MineLogic>();
    super.dispose();
  }
}